<template>
  <div class="notesView">
    <header>
      <div class="title">手记</div>
    </header>
    <div class="likeheader"></div>
    <div class="index">
      <NoteItem v-for="note in notes" :key="note.id" :note="note" />
    </div>
  </div>
</template>

<script>
import NoteItem from "@/components/NoteItem.vue";

export default {
  // name: "NotesView",
  components: {
    NoteItem,
  },
  data() {
    return {
      notes: null,
      page: 1,
    };
  },
  created() {
    // this.$axios
    //   .get(`https://apis.netstart.cn/xpc/notes?page=${this.page}`)
    //   .then((res) => {
    //     this.notes = res.data.data.list;
    //     // this.page++;
    //   });
    this.$axios.get(`/noteRecommend.json`).then((res) => {
      this.notes = res.data.data.list;
      // this.page++;
    });
  },
};
</script>

<style lang="scss" scoped>
.notesView {
  background-color: #f2f2f2;

  header {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    background-color: white;
    border-bottom: 1px solid #f2f2f2;

    .title {
      font-size: 20px;
      font-weight: bold;
    }
  }

  .likeheader {
    height: 50px;
  }
}
</style>
